<html class="standard">

<head>
    <meta charset="utf-8">
    <title>客服首页</title>
    <link href="../css/im_index/ly/c.css" type="text/css" rel="stylesheet">
    <link href="../css/im_index/ly/main.css" type="text/css" rel="stylesheet">
    <link href="../css/framework/layui.css" type="text/css" rel="stylesheet">
    <link href="../css/im_index/home.css" type="text/css" rel="stylesheet">
    <!-- <link href="../css/framework/bootstrap-theme.css" type="text/css" rel="stylesheet"> -->

</head>

<body>

    <div id="wrap">
        <div id="header">
            <div class="top">
                <ul class="layui-nav">
                    <div id="top" class="top-in">
                        <li class="layui-nav-item home">
                            <a href="../html/service-home.html" class="active" style="color:#22d7c6">{{shopName}}  客服 - 首页</a>
                        </li>
                        <li class="layui-nav-item message">
                            <a href="../html/service-chat.html">消息 </a>
                        </li>
                        <li class="layui-nav-item person; width:auto;">
                            <a href="../html/service-person.html">
                                <span>
                                    {{nickname}}
                                </span>
                                &nbsp;&nbsp;<img :src="avatarUrl" class="layui-nav-img"></a>

                        </li>
                        <li class="layui-nav-item">
                                <a href="" class="active" onclick="logout()">退出</a>
                        </li>
                </ul>



            </div>
        </div>

        <div id="service-list">

            <h1>客服即时聊天</h1>
            <h1>点击消息查看聊天</h1>

        </div>

    </div>
    </div>
    </div>


    <script src="../js/framework/vue.js"></script>
    <script src="../js/framework/layui.js"></script>
    <script src="../js/framework/jquery-3.2.1.min.js"></script>
    <script src="../js/im_index/commons.js"></script>
    <script src="../js/framework/bootstrap.min.js"></script>

    <script>
        checkRole(1)
        checkLogin()

        // data loading...
        $(function () {

            // 拿到登录的数据
            var account = localStorage.getItem("account");
            var aid = localStorage.getItem("aid");
            var role = localStorage.getItem("role");

            // xxxxxxxxx 

            // 个人信息初始化
            topinfo.nickname = localStorage.getItem("nickname");
            topinfo.avatarUrl = localStorage.getItem("avatarUrl");

            // 商店名字
            url = "http://localhost:8080/user/getShopName?serviceName=" + topinfo.nickname;
            $.ajax({
                url: url,
                type: 'get',
                contentType: 'application/json; charset=UTF-8',
                success: function (userList) {
                    topinfo.shopName = userList.msg;
                    //   return userList
                },
                error: function () {
                    console.log("服务器获取失败");
                }
            });

            getServiceList();

            // 验证是否登录 xxx

            // 获取客服列表
            function getServiceList() {
                url = "http://127.0.0.1:8080/service/list?account=" + account;
                $.ajax({
                    url: url,
                    type: 'get',
                    contentType: 'application/json; charset=UTF-8',
                    success: function (userList) {
                        service_list.services = userList.data;
                        //   return userList
                    },
                    error: function () {
                        console.log("服务器获取失败");
                    }
                });
            }

        });

        // 头条个人栏
        var topinfo = new Vue({
            el: '#top',
            data: {
                nickname: "",
                avatarUrl: "",
                shopName:""
            },
            methods: {
                openChat: function (event, user) {

                },
            },
        });

        /**
         * 客服列表
         * 选择客服->跳转到聊天列表
         *
         */
        var service_list = new Vue({
            el: '#service-list',
            data: {
                services: [{
                        shopId: 121,
                        serviceId: 13,
                        avatarUrl: "../img/a.JPG",
                        serviceName: "田",
                        shop: "京东"
                    },
                    {
                        shopId: 121,
                        serviceId: 13,
                        avatarUrl: "../img/b.JPG",
                        serviceName: "小兰",
                        shop: "京东"
                    },
                    {
                        shopId: 121,
                        serviceId: 13,
                        avatarUrl: "../img/c.JPG",
                        serviceName: "安捷",
                        shop: "盛大1"
                    },
                    {
                        shopId: 121,
                        serviceId: 13,
                        avatarUrl: "../img/e.JPG",
                        serviceName: "天",
                        shop: "盛大1"
                    }
                ],
                message: "aaa",
            },
            methods: {
                openChat: function (event, user) {
                    s = sessionStorage.getItem("tokenUid");

                    console.log(s)
                    console.log(user.serviceId)

                    // window.location.href = "im.html";
                    window.location.href = "chat.html?serviceId=" + user.serviceId;

                },
            },


        });
    </script>

</body>

</html>